<template>
  <div>
    <h1>管理员-理财列表</h1>

    理财编号:<input type="text" v-model="query.mid">
    理财名称:<input type="text"  v-model="query.mname">
    <input type="button" value="查询" @click="getList" >
    <table>
      <tr>
        <td>理财ID</td>
        <td>理财名称</td>
        <td>年收益</td>
        <td>利息</td>
        <td>最低金额</td>
        <td>理财人次</td>
        <td>风险等级</td>
        <td>操作</td>
      </tr>
      <tr v-for="item in info">
        <td>{{item.Mid}}</td>
        <td>{{item.MName}}</td>
        <td>{{item.YearMoney*12}}</td>
        <td>{{item.LxNumber}}</td>
        <td>{{item.YearMoney}}</td>
        <td>{{item.Num}}</td>
        <td>{{item.Lv}}</td>
        <td>
          <a>删除</a>
        </td>
      </tr>
    </table>

    总共<span>{{PageCount}}</span>页
    每页显示<span>{{query.size}}</span>条
    当前<span>{{query.index}}</span>/
    <span>{{ListCount}}</span>页


    <a @click="page(1)">首页</a>
    <a @click="page(query.index-1)">上一页</a>
    <a @click="page(query.index+1)">下一页</a>
    <a @click="page(ListCount)">尾页</a>

    <input type="text" v-model="textIndex" >
    <input type="button" value="go" @click="page(textIndex)" >

  </div>
</template>

<script setup lang="ts">

    import axios from 'axios';
    import {reactive,toRefs,onMounted} from 'vue'
    import { useUserStors } from '@/stors/user';

    const useStors=useUserStors();

    let data:any=reactive({
      info:[],
      query:{
        index:1,
        size:2,
        mid:'',
        mname:''
      },
      PageCount:'',
      ListCount:'',
      textIndex:1
    })

    let {info,query,PageCount,ListCount,textIndex} =toRefs(data);

    onMounted(()=>{
      getList();
    })

    const page=(i:any)=>{
      console.log(i);
      
      if (i>=0 && i<=ListCount.value) {
        query.value.index=i;
        getList();
      }
    }

    const getList=()=>{
      axios({
        url:'/api/UserMoney/UserShow',
        method:'get',
        params:query.value
      }).then(res=>{
        console.log(res.data);
        
        info.value=res.data.Date
        PageCount.value=res.data.PageCount
        ListCount.value=res.data.ListCount

      }).catch(err=>{

      })
    }

</script>

<style scoped>

</style>